<template>
  <p>适配</p>
  <a-button type="primary" @click="showDrawer">Open</a-button>
  <a-drawer v-model:open="open" class="custom-class" root-class-name="root-class-name" :root-style="{ color: 'blue' }"
    style="color: red" title="Basic Drawer" placement="right" @after-open-change="afterOpenChange">
    <p>Some contents...</p>
    <p>Some contents...</p>
    <p>Some contents...</p>
  </a-drawer>
</template>

<script setup>

import { ref } from 'vue';
const open = ref(false);
const afterOpenChange = bool => {
  console.log('open', bool);
};
const showDrawer = () => {
  open.value = true;
};

</script>
<style>
p {
  font-size: 1rem
}
</style>